<template>
  <div v-show="isPreview" ref="print" style="width:100%; margin: 0 auto;">
    <div v-for="(items, index) in list" :key="index + 100">
      <table>
        <tr>
          <div class="l" style="padding-left: -30px"><img :src="data.title" width="200px" height="15px" /></div>
          <td colspan="7" align="center" height="24" style="font-size: 24px;">盘点报告</td>
        </tr>
        <tr>
          <td><span style="font-weight:blod">经手人:</span>{{ data.handler }}</td>
        </tr>
        <tr>
          <td colspan="3" align="left" height="26">盘点单号：{{ data.inventoryNo }}&nbsp;</td>
          <td colspan="4" align="right" height="26">盘点日期：{{ data.inventoryDate }}&nbsp;</td>
        </tr>
      </table>

      <table class="bor fs12">
        <tr>
          <td width="4%" height="26" align="center">序号</td>
          <!-- width="12%" -->
          <td align="center">仓库</td>
          <td align="center">库位</td>
          <td width="24%" align="center">配件件号</td>
          <td width="20%" align="center">配件名称</td>
          <td align="center">账面数量</td>
          <td align="center">成本金额(元)</td>
          <td align="center">清点数量</td>
          <td align="center">差异数量</td>
          <td align="center">成本单价(元)</td>
          <td align="center">差异金额(元)</td>
          <!-- <td width="11.5%" align="left">盈亏金额</td> -->
        </tr>
        <tr v-for="(x, index) in items.arr" :key="x.index">
          <td height="24" align="center">{{ index + 1 }}</td>
          <td align="center">{{ x.STORAGE_NAME }}</td>
          <td align="center">{{ x.STORAGE_POSITION_CODE }}</td>
          <td align="center">{{ x.PART_NO }}</td>
          <td align="center">{{ x.PART_NAME }}</td>
          <td align="center">{{ x.CURRENT_STOCK.toFixed(2) }}</td>
          <td align="center">{{ (x.CURRENT_STOCK * x.COST_PRICE).toFixed(2) }}</td>
          <td align="center">{{ Number(x.CHECK_QUANTITY).toFixed(2) }}</td>
          <td align="center">{{ Number(x.PROFIT_LOSS_QUANTITY).toFixed(2) }}</td>
          <td align="center">{{ Number(x.COST_PRICE).toFixed(2) }}</td>
          <td align="center">{{ Number(x.PROFIT_LOSS_QUANTITY * x.COST_PRICE).toFixed(2) }}</td>
          <!-- <td align="center">{{ Number(x.PROFIT_LOSS_QUANTITY * x.COST_PRICE).toFixed(2) }}</td> -->
        </tr>
      </table>

      <table>
        <tr>
          <td align="left">报溢数量:{{ totalQuantity[0] }},报溢金额:{{ totalPrice[0] }}</td>
          <td align="right">报损数量:{{ totalQuantity[1] }},报损金额:{{ totalPrice[1] }}</td>
        </tr>
        <tr>
          <td align="right" colspan="2">备注：{{ data.remark }}</td>
        </tr>
        <tr>
          <td align="left">本单一式三份</td>
          <td align="right">打印时间:{{ nowTime }}</td>
        </tr>
      </table>

      <div style="page-break-after: always;height: 0;">&nbsp;</div>
    </div>
  </div>
</template>

<script>
/**
 * @Author: 焦质晔
 * @Date: 2019/4/22
 * @Last Modified by:   焦质晔
 * @Last Modified time: 2019-04-22 15:45:09
 **/
import moment from 'moment';
import Cookies from 'js-cookie';
export default {
  name: 'templateCheckList',
  props: {
    data: {
      type: Object,
      required: true,
      default() {
        return {};
      }
    },
    isPreview: {
      type: Boolean,
      default: false
    }
  },
  data() {
    return {
      nowTime: moment().format('YYYY-MM-DD HH:mm:ss'),
      checkListNumber: '',
      cols: 6,
      dealerName: Cookies.get('dealerName'),
      list: []
    };
  },
  computed: {
    // totalPrice() {
    //   return this.data.items.reduce((prev, curr) => {
    //     return curr.ckdj * curr.ckdj + prev;
    //   }, 0);
    // },
    // 统计数量和累计金额
    totalPrice() {
      let totalProPrice = 0;
      let totalLossPrice = 0;
      this.data.inventoryList.forEach(x => {
        if (x.PROFIT_LOSS_QUANTITY > 0) {
          totalProPrice = Number(x.PROFIT_LOSS_QUANTITY * x.COST_PRICE) + totalProPrice;
        } else {
          totalLossPrice = Number(x.PROFIT_LOSS_QUANTITY * x.COST_PRICE) + totalLossPrice;
        }
      });
      return [totalProPrice.toFixed(2), totalLossPrice.toFixed(2)];
    },
    totalQuantity() {
      let proTotal = 0;
      let lossTotal = 0;
      this.data.inventoryList.forEach(x => {
        if (x.PROFIT_LOSS_QUANTITY > 0) {
          proTotal = Number(x.PROFIT_LOSS_QUANTITY) + proTotal;
        } else {
          lossTotal = Number(x.PROFIT_LOSS_QUANTITY) + lossTotal;
        }
      });
      return [proTotal.toFixed(2), lossTotal.toFixed(2)];
    }
  },
  mounted() {
    this.$emit('onPrintTable', this.$refs.print.innerHTML);
    if (this.isPreview) {
      this.fillInToDom();
    }
  },
  created() {
    this.handle();
  },
  methods: {
    fillInToDom() {
      this.isPreview = true;
    },
    handle() {
      // this.data.title = require('@/assets/img/beijing.png');
      if (this.data.appId == 'beijing') {
        this.data.title = require('@/assets/img/beijing.png');
      } else {
        this.data.title = require('@/assets/img/arcfox.png');
      }
      let dataList = JSON.parse(JSON.stringify(this.data.inventoryList));
      let number = Math.ceil(this.data.inventoryList.length / 30);
      this.number = number;
      for (let i = 1; i <= number; i++) {
        if (number == i) {
          let obj = {};
          obj.arr = dataList.splice(0, dataList.length);
          obj.index = i;
          this.list.push(obj);
        } else {
          let obj = {};
          obj.arr = dataList.splice(0, 30);
          obj.index = i;
          this.list.push(obj);
        }
      }
    }
  }
};
</script>
